<!DOCTYPE html>
<!--
This is a starter template page. Use this page to start your new project from
scratch. This page gets rid of all links and provides the needed markup only.
-->
<html>
<head>
<#include "common/publicMETA.ftl"/>
    <title>大玩家V1.0</title>
<#include "common/publicCSS.ftl"/>
    <link rel="stylesheet" href="${ctx}/plugins/zTree_v3.5.28/css/metroStyle/metroStyle.css">
<#include "common/publicHeadJS.ftl"/>
    <style>

        .box-header .box-title {
            line-height: 30px;
        }

        .box-header {
            padding: 5px;
        }
        .list-group-item:first-child {
            border-top-left-radius: 0px;
            border-top-right-radius: 0px;
        }
        ul.list-group a.list-group-item:last-child {
            margin-bottom: 0;
            border-radius: 0;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            box-shadow: none;
            border-width: 1px;
        }
    </style>
</head>
<!--
BODY TAG OPTIONS:
=================
Apply one or more of the following classes to get the
desired effect
|---------------------------------------------------------|
| SKINS         | skin-blue                               |
|               | skin-black                              |
|               | skin-purple                             |
|               | skin-yellow                             |
|               | skin-red                                |
|               | skin-green                              |
|---------------------------------------------------------|
|LAYOUT OPTIONS | fixed                                   |
|               | layout-boxed                            |
|               | layout-top-nav                          |
|               | sidebar-collapse                        |
|               | sidebar-mini                            |
|---------------------------------------------------------|
-->
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">
<#include "common/mainHeader.ftl">
<#include "common/mainSidebar.ftl"/>
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
    <#--<section class="content-header">-->
    <#--<h1>-->
    <#--首页-->
    <#--<small>记账盘</small>-->
    <#--</h1>-->
    <#--<ol class="breadcrumb">-->
    <#--<li><a href="#"><i class="fa fa-dashboard"></i> Level</a></li>-->
    <#--<li class="active">Here</li>-->
    <#--</ol>-->
    <#--</section>-->

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-3">
                    <div class="box">
                        <div class="box-header with-border">
                            <h3 class="box-title">组织机构</h3>
                            <button type="button" class="btn btn-default btn-sm pull-right" onclick="OpenAddOrg()"><i class="fa fa-plus"></i>新增</button>
                        </div>
                        <div class="box-body table-responsive">
                            <ul id="treeDemo" class="ztree"></ul>
                        </div>
                    </div>
                </div>
                <div class="col-xs-6">
                    <div class="box">
                        <div class="box-header with-border">
                            <h3 class="box-title">用户列表</h3>
                            <button type="button" class="btn btn-default btn-sm pull-right" onclick="OpenAddUser()"><i class="fa fa-plus"></i>新增</button>
                        </div>
                        <div class="box-body table-responsive">
                            <table id="datatable" style="border: 1px solid #000" data-url="/user/queryByUserPage.do" ishascheck="true">
                            </table>
                        </div>
                    </div>
                </div>
                <div class="col-xs-3">
                    <div class="box">
                        <div class="box-header with-border">
                            <h3 class="box-title">角色列表</h3>
                            <button type="button" class="btn btn-default btn-sm pull-right" onclick="OpenAddRole()"><i class="fa fa-plus"></i>新增</button>
                        </div>
                        <div class="box-body table-responsive">
                            <div class="list"></div>
                        </div>
                    </div>
                </div>
            </div>


            <!-- Your Page Content Here -->

        </section>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->
<#include "common/mainFooter.ftl"/>
<#--<#include "common/controlSidebar.ftl"/>-->
</div>
<!-- ./wrapper -->
<!-- REQUIRED JS SCRIPTS -->
<#include "common/publicFootJS.ftl"/>
<script src="${ctx}/plugins/laypage/laypage.js"></script>
<script src="${ctx}/plugins/zTree_v3.5.28/js/jquery.ztree.core.min.js"></script>
<script src="${ctx}/plugins/zTree_v3.5.28/js/jquery.ztree.excheck.min.js"></script>
<script src="${ctx}/plugins/zTree_v3.5.28/js/jquery.ztree.exedit.min.js"></script>
<script type="text/javascript" src="${ctx}/plugins/myplugin/tablepage.js"></script>
<script>
    <!--
    var setting = {
        view: {
            addHoverDom: addHoverDom,
            removeHoverDom: removeHoverDom,
            selectedMulti: false
        },
        check: {
            enable: true
        },
        data: {
            simpleData: {
                enable: true
            }
        },
        edit: {
            enable: true,
            renameTitle:"修改",
            removeTitle:"删除"
        },
        callback:{
            beforeEditName : beforeEditName
        }
    };

    var zNodes =[
        { id:1, pId:0, name:"父节点1", open:true},
        { id:11, pId:1, name:"父节点11"},
        { id:111, pId:11, name:"叶子节点111"},
        { id:112, pId:11, name:"叶子节点112"},
        { id:113, pId:11, name:"叶子节点113"},
        { id:114, pId:11, name:"叶子节点114"},
        { id:12, pId:1, name:"父节点12"},
        { id:121, pId:12, name:"叶子节点121"},
        { id:122, pId:12, name:"叶子节点122"},
        { id:123, pId:12, name:"叶子节点123"},
        { id:124, pId:12, name:"叶子节点124"},
        { id:13, pId:1, name:"父节点13", isParent:true},
        { id:2, pId:0, name:"父节点2"},
        { id:21, pId:2, name:"父节点21", open:true},
        { id:211, pId:21, name:"叶子节点211"},
        { id:212, pId:21, name:"叶子节点212"},
        { id:213, pId:21, name:"叶子节点213"},
        { id:214, pId:21, name:"叶子节点214"},
        { id:22, pId:2, name:"父节点22"},
        { id:221, pId:22, name:"叶子节点221"},
        { id:222, pId:22, name:"叶子节点222"},
        { id:223, pId:22, name:"叶子节点223"},
        { id:224, pId:22, name:"叶子节点224"},
        { id:23, pId:2, name:"父节点23"},
        { id:231, pId:23, name:"叶子节点231"},
        { id:232, pId:23, name:"叶子节点232"},
        { id:233, pId:23, name:"叶子节点233"},
        { id:234, pId:23, name:"叶子节点234"},
        { id:3, pId:0, name:"父节点3", isParent:true}
    ];

    $(document).ready(function(){
        $(".list").listData(rows);
        $("#datatable").tablepage();
        $.fn.zTree.init($("#treeDemo"), setting, zNodes);
    });
    function lockRender(e) {
        var value=e.value;
        if(value==1){
            e.value="启用";
        }else if(value==2){
            e.value="禁用";
        }
    }
    var newCount = 1;
    function addHoverDom(treeId, treeNode) {
        var sObj = $("#" + treeNode.tId + "_span");
        if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0) return;
        var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
                + "' title='新增' onfocus='this.blur();'></span>";
        sObj.after(addStr);
        var btn = $("#addBtn_"+treeNode.tId);
        if (btn) btn.bind("click", function(){
            var zTree = $.fn.zTree.getZTreeObj("treeDemo");
            zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"new node" + (newCount++)});
            return false;
        });
    };
    function beforeEditName(treeId, treeNode){
        alert(0);
        var zTree = $.fn.zTree.getZTreeObj("treeDemo");
        zTree.selectNode(treeNode);
        return false;
    }
    function removeHoverDom(treeId, treeNode) {
        $("#addBtn_"+treeNode.tId).unbind().remove();
    };
    var rows = [];
    for (var i = 0; i < 15; i++) {
        var row = {};
        row.name = "字典类型#" + i + "#";
        row.value = i;
        rows.push(row)
    }
    /*打开新增机构*/
    function OpenAddOrg(){
        layer.open({
            type: 2,
            title:"新增机构",
            area: ['500px', '400px'],
            content: '${ctx}/org/addOrgIndex.html',
            btn:["确定","取消"],
            yes: function(index, layero){
                addOrg(index, layero);
            }
        });
    }
    /*新增机构*/
    function addOrg(index, layero) {
        var form = layer.getChildFrame('#orgform', index);
        var params=$("#orgform").getFormData();
        $.post("${ctx}/org/addOrUpdOrg.do",params, function (result) {
            layer.msg(result.info);
        });
    }
    /*打开新增用户*/
    function OpenAddUser(){
        layer.open({
            type: 2,
            title:"新增用户",
            area: ['500px', '600px'],
            content: '${ctx}/user/addUserIndex.html',
            btn:["确定","取消"],
            yes: function(index, layero){
                layer.msg("点击了确定");
            }
        });
    }
    /*打开新增角色*/
    function OpenAddRole(){
        layer.open({
            type: 2,
            title:"新增机构",
            area: ['500px', '400px'],
            content: '${ctx}/role/addRoleIndex.html',
            btn:["确定","取消"],
            yes: function(index, layero){
                layer.msg("点击了确定");
            }
        });
    }

    //-->
</script>
<!-- Optionally, you can add Slimscroll and FastClick plugins.
     Both of these plugins are recommended to enhance the
     user experience. Slimscroll is required when using the
     fixed layout. -->
</body>
</html>
